<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>index</title>

    <script th:src="@{js/jquery-3.6.0.min.js}" type="application/javascript"></script>
    <script>
     $(function (){
         $("#btnDept").click(function (){
             $.ajax({url:"/ajaxQuery",
                 dataType:"json",
                 success:function(result){
                 let str="";
                     for (let i = 0; i < result.length; i++) {
                         console.log(result[i].deptNo)
                         console.log(result[i].deptName)
                         console.log(result[i].deptremark)
                         str=str+"<tr>"
                             +"<td>"+result[i].deptNo+"</td>"
                             +"<td>"+result[i].deptName+"</td>"
                             +"<td>"+result[i].buildDate+"</td>"
                             +"<td>"+result[i].deptFee+"</td>"
                             +"<td>"+result[i].deptremark+"</td>"
                             +"</tr>"
                     }
                     $("#deptTable").html(str);
                 },
                 error:function (err){
                  alert(err);
                 }
             });
         })
     })

    </script>


</head>
<body>
  <h1>首页</h1>
  <a href="/gotoAdd">添加</a>
  <form action="/query" method="post">
      <input name="deptNo" type="text" placeholder="请输入部门编号">
      <input name="deptName" type="text" placeholder="请输入部门名称">
      <input type="submit" value="查询">
  </form>

    <table border="1">
     <tr>
         <td>编号</td>
         <td>部门名称</td>
         <td>成立日期</td>
         <td>部门经费</td>
         <td>备注</td>
         <td>操作</td>

     </tr>
        <tr th:each="dept,state:${list}"th:bgcolor="${state.index}%2==0?'yellow':'skybule'" >
          <td th:text="${dept.deptNo}"></td>
            <td th:text="${dept.deptName}"></td>
            <td th:text="${#dates.format(dept.buildDate,'yyyy-MM-dd')}"></td>
            <td th:text="${#numbers.formatCurrency(dept.deptFee)}"></td>
            <td th:text="${dept.deptremark}"></td>
            <td>
                <a th:href="@{/gotoEdit/}+${dept.deptNo}">修改</a>
                <a th:href="@{/del(deptNo=${dept.deptNo})}">删除</a>

            </td>

        </tr>
    </table>


    <button id="btnDept" >获取数据</button>
    <table border="1" id="deptTable">

    </table>
</body>
</html>